<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <input type="file" id="file" onchange="handle(event)">
</body>
</html>
<script>
var imageType = /image.*/;
var getOnloadFunc = function(aImg) {
	return function(evt) {
		aImg.src = evt.target.result;
	};
}
function handle(event){
        var input=event.target
        for (var i = 0, numFiles = input.files.length; i < numFiles; i++) {
        var file = input.files[i];
        console.log(file)
        if (!file.type.match(imageType)) {
            continue;
        }

	    var img = document.createElement("img");
	    document.body.appendChild(img);

	    var reader = new FileReader();
	    reader.onload = getOnloadFunc(img);
	    reader.readAsDataURL(file);
    }
}
</script>